<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://lib.baomitu.com/jquery/1.12.4/jquery.min.js"></script>
    <title>Document</title>
</head>
<body>
    

    <!-- 使用$ ，则需要引入Jquery，头文件中加入<script src="https://lib.baomitu.com/jquery/1.12.4/jquery.min.js"></script>引入Jquery -->

    <script>
        // // // 发送请求查询：用户信息-用户的课程信息-课程成绩

        // 1、老方法
        // $.ajax({
        //     url: "user.json",
        //     success(data1){
        //         console.log("用户信息查询成功：",data1);
        //         $.ajax({
        //             url: `user_corse_${data1.id}.json`,
        //             success(data2){
        //                 console.log("查询用户课程成功：",data2);
        //                 $.ajax({
        //                     url: `corse_score_${data2.id}.json`,
        //                     success(data3){
        //                         console.log("查询课程分数成功：",data3);
        //                     },
        //                     error(error3){
        //                         console.log("查询课程分数失败：",error3);
        //                     }
        //                 })
        //             },
        //             error(error2){
        //                 console.log("查询用户课程失败：",error2);
        //             }
        //         })
        //     },
        //     error(error1){
        //         console.log("用户信息查询失败：",error1);
        //     }
        // });

            // 用户信息查询成功：Object
            //                     id: 1
            //                     password: "123456"
            //                     username: "king"
            // 查询用户课程成功： Object
            //                     id: 10
            //                     name: "chinese"
            // 查询课程分数成功： Object
            //                     id: 100
            //                     score: 100



            // // Promise 可以封装一步操作
            // let p = new Promise((resovle, reject)=>{ //resovle：请求成功，使用resovle（数据data）它传下去，reject：请求失败，使用reject(参数error)传下去
            //     if(true){
            //         resovle(data); //传数据下去，使用 then(参数)获取
            //     }
            //     if(false){
            //         reject(error); //传下失败数据，使用catch(参数)获取
            //     }
            // });



        // // 2、使用ajax+Promise处理请求
        // let p1 = new Promise((resovle, reject)=>{
        //     $.ajax({
        //         url: "user.json",
        //         success(data1){
        //             console.log("查询用户信息成功：",data1)
        //             resovle(data1);
        //         },
        //         error(error1){
        //             reject(error1);
        //         }
        //     })
        // });


        // let p2 = p1.then((data1)=>{
        //     return new Promise((resovle, reject)=>{
        //         $.ajax({
        //             url: `user_corse_${data1.id}.json`,
        //             success(data2){
        //                 console.log("查询用户课程成功：",data2)
        //                 resovle(data2)
        //             },
        //             error(error2){
        //                 reject(error2)
        //             }
        //         })
        //     })
        // }).catch((error1)={

        // })

        // let p3 = p2.then((data2)=>{
        //     $.ajax({
        //         url: `corse_score_${data2.id}.json`,
        //         success(data3){
        //             console.log("查询课程分数成功：",data3);
        //         },
        //         error(error3){
        //             console.log("查询课程分数失败：",error3);
        //         }
        //     })
        // }).catch((error2)={

        // })






        // 3、优化promise+ajax
        function select(url,params){
            return new Promise((resovle, reject)=>{
                $.ajax({
                    url: url,
                    data: params,
                    success(data){
                        resovle(data)
                    },
                    error(error){
                        reject(error)
                    }
                })
            })
        }

        select("user.json").then((data)=>{
            console.log("查询用户信息成功：",data);
            return select(`user_corse_${data.id}.json`);
        }).then((data)=>{
            console.log("查询用户课程：",data);
            return select(`corse_score_${data.id}.json`);
        }).then((data)=>{
            console.log("查询课程分数：",data);
        })

    </script>


</body>
</html>